<template>
    <div>
        <div class="container" style="height:100vh">
            <div class="userCenter">
                <img class="user_img" src="../../images/user_bg.png">
                <!--<open-data class="head_img" default-avatar="https://imgs.xlgxapp.com/app_imgs/default_headimg.png"-->
                <!--           type="userAvatarUrl">-->
                <!--</open-data>-->
                <img class="head_img" src="https://imgs.xlgxapp.com/app_imgs/default_headimg.png">
                <img v-if="badge" class="head_badge" src="../../images/weizhang.png">
                <div class="user_phone">
                    <div>{{userPhone}}<span class="textButton" @click="goAuth">{{authName}}</span></div>
                    <div class="info">
                        <div class="leftInfo">信用分<span class="infoNum">{{integral}}</span></div>
                        <div class="rightInfo">累计骑行<span class="infoNum">{{mileage}}</span></div>
                    </div>
                </div>
                <div class="list_view">
                    <div class="user_cell" hover-class="user_hover" @click="turnPage" data-target="recharge">
                        <img class="cell_icon" src="../../images/cash_2.png">
                        <span class="cell_text">我的钱包</span>
                        <img class="cell_icon_right" src="../../images/arrowRight@3x.png">
                    </div>
                    <div class="user_cell" @click="turnPage" data-target="newDiscount" hover-class="user_hover">
                        <img class="cell_icon" src="../../images/discount_2.png">
                        <span class="cell_text">我的优惠</span>
                        <img class="cell_icon_right" src="../../images/arrowRight@3x.png">
                    </div>
                    <div class="user_cell" @click="turnPage" data-target="wallent" hover-class="user_hover">
                        <img class="cell_icon" src="../../images/wallet_2.png">
                        <span class="cell_text">钱包明细</span>
                        <img class="cell_icon_right" src="../../images/arrowRight@3x.png">
                    </div>
                    <div class="user_cell" @click="turnPage" data-target="msg" hover-class="user_hover">
                        <img class="cell_icon" src="../../images/msg.png">
                        <div class="cell_text">
                            <div>我的消息</div>
                            <div class="dot" v-if="count>0"></div>
                        </div>
                        <img class="cell_icon_right" src="../../images/arrowRight@3x.png">
                    </div>
                    <div class="user_cell" @click="turnPage" data-target="setting" hover-class="user_hover">
                        <img class="cell_icon" src="../../images/setting.png">
                        <span class="cell_text">设置</span>
                        <img class="cell_icon_right" src="../../images/arrowRight@3x.png">
                    </div>
                    <div class="user_cell noAfter" @click="goWebview" hover-class="user_hover">
                        <img class="cell_icon" src="../../images/kf_2.png">
                        <span class="cell_text">在线客服</span>
                        <img class="cell_icon_right" src="../../images/arrowRight@3x.png">
                    </div>
                    <!-- <button @click="authMsg">授权通知</button> -->
                    <div class="newTips" style="bottom:1.5rem">更多用车体验，尽在小遛共享APP</div>
                    <div class="tips" style="bottom:0.8rem" @click="tel">如遇到任何问题，请联系客服电话<span class="tel">400-607-6666</span>
                    </div>
                </div>
                <my-dialog :dialog_hidden="phoneHidden" :show_cancel="showCancel" confirmText="选好了" title="请选择你的问题类型"
                           @confirmEvent="phoneConfirm">
                    <img class="closeIcon" src="../../images/tipClose@3x.png" @click="close">
                    <div class="reasonRow">
                        <div v-for="(item, idx) in list"  :key="item.id">
                            <div :class="[selectId == item.id ? 'selected' : 'reasonItem']" :data-index="idx"
                                 :data-id="item.id" :data-name="item.name" @click="selectRechargeNum">
                                {{item.name}}
                            </div>
                        </div>
                    </div>
                </my-dialog>
            </div>
        </div>
    </div>

</template>
<script>
    import userCenter from './userCenter'
    export default {
        mixins: [userCenter],
        data() {
            return {

            }
        }
    }
</script>
<style scoped lang="stylus">
    .container{
        font-size 20px
    }
    @import "./userCenter.styl"
</style>
